<template>
  <div>
    <list-page :data="listPageConfig">
      <template v-slot:tableColumn>
        <el-table-column
          align="center"
          label="标题"
          prop="title"
          show-overflow-tooltip
        />
        <el-table-column
          align="center"
          label="内容"
          prop="content"
          show-overflow-tooltip
        />
        <el-table-column
          align="center"
          label="手机号"
          prop="users_tel"
          show-overflow-tooltip
        />
        <el-table-column
          align="center"
          label="状态"
          prop="status_title"
          show-overflow-tooltip
        />
      </template>
    </list-page>
  </div>
</template>

<script>
import tableMixin from '@/mixin/tablePageMixin'
import ListPage from '@/views/_common/ListPage'
import { request } from '../../../../api/request'

export default {
  name: 'Sms',

  components: {
    ListPage
  },

  mixins: [tableMixin],

  data() {
    return {}
  },

  computed: {
    listPageConfig() {
      return {
        pageLoading: this.config.operating,
        dataLoading: this.config.loading,
        buttons: [],
        table: {
          props: { data: this.tableData },
          on: { 'row-click': this.rowClick }
        },
        pagination: {
          props: { model: this.searchForm },
          on: {
            'current-change': this.pageChange,
            'size-change': this.pageSizeChange
          }
        }
      }
    }
  },

  methods: {
    search() {
      if (this.config.loading) return
      this.config.loading = true
      request(
        'company/message/shortLetter/index',
        { p: this.searchForm.page, limit: this.searchForm.pageSize },
        (res) => {
          this.searchForm.total = res.data.count
          this.tableData = res.data._list
        }
      ).finally(() => {
        this.config.loading = false
      })
    }
  }
}
</script>
